<template>
  <div>
    <img src="./img/1.jpg" alt="Pineapple" width="300" height="300" class="img" />
    <el-input v-model.lazy="title" />
    <p>输入的内容：{{ title }}</p>
    <div class="lazyLoadImg_wrap">
        <img v-lazy="imgUrl" alt="">
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      title: "",
      imgUrl: "//vpclub-img.oss-cn-shenzhen.aliyuncs.com/upload/vphonor/202005/26/637261087251589902.jpg",
　　　 index:1
    };
  },
  created(){
     console.log(window.performance.now(),"now")
  },
  methods: {

  }
};
</script>

<style>
.img {
  -webkit-animation: mymove 7s infinite; /* Chrome, Safari, Opera */
  animation: mymove 7s infinite;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes mymove {
  50% {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
  }
}

/* Standard syntax */
@keyframes mymove {
  50% {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
  }
}
</style>